<template>
  <div>
    <el-cascader v-model="value" placeholder="Try searchingL Guide" :options="options" filterable @expand-change="change"
      @change="change" />
    <button @click="asd">asd1</button>
  </div>
</template>

<script setup lang="ts">
import { RequestWarehouseList, RequestUpWarehouseAreaGetAreaInfo } from "@/api/path/index.js"
import { ref } from 'vue'
const options = ref<any>([

])
const getData = () => {
  RequestWarehouseList().then((res: any) => {
    res.resultObj.forEach((item: any) => {
      item.value = item.warehouseId
      item.label = item.warehouseName
    });
    console.log(res.resultObj);
    options.value = res.resultObj

  })
}
getData()
const change = (event: any) => {
  console.log(event);
  RequestUpWarehouseAreaGetAreaInfo(event).then((res: any) => {
    res.resultObj.forEach((item: any) => {
      console.log(item);
      item.label = item.area
      item.value = item.area
      item.children = item.list
      item.list.forEach((val: any) => {
        val.label = val.position
        val.value = val.id
      });
    });
    options.value.forEach((item: any) => {
      item.children = res.resultObj
    });
  })
}
let value = ''
const asd = () => {
  console.log(value);
}
</script>

<style scoped></style>